Material Design Icons



Turnkey

There's built-in support for using the Material design icon pack in Turnkey.

To draw arbitrary material design icon - set DataIsHtml and:

'<i class="material-icons">SomeHexNumber</i>'

The hexnumber takes this form &#xe9ba and is copied from google.

You find the icon codes to use here:Material Symbols & Icons - Google Fonts

WPF

In the WECPOFLogic assembly, we have included the MaterialIcons-Regular.ttf (added as Resource) and MaterialIcons-Regular.codepoints (added as Embedded Resource).

We then have a font family defined like this:

<FontFamily x:Key="materialdesigniconsfont">pack://application:,,,/WECPOFLogic;component/Fonts/#Material Icons</FontFamily>

If you have that row in your WPF-application App.Resources, you can use FontFamily={StaticResource materialdesigniconsfont} in xaml.

You must use the character code per icon (the complete list is in MaterialIcons-Regular.codepoints).

There are new hooks on ViewModelWPFUserControl:

Eco.ViewModel.WPF.ViewModelWPFUserControl.IconFontFamilyResourceName = "materialdesigniconsfont";
Eco.ViewModel.WPF.ViewModelWPFUserControl.IconFontIconNameResolverInstall(IconNameResolver);

The IconNameResolver must take a named icon and return the correct character.

    public static Dictionary<string, string> IconNameToValueDict
    {
      get;
      private set;
    }
    public static string IconNameResolver(string name)
    {
      if (IconNameToValueDict == null)
      {
        IconNameToValueDict = new Dictionary<string, string>();
        var stream = typeof(WECPOFTabBased).Assembly.GetManifestResourceStream(typeof(WECPOFTabBased).Assembly.GetName().Name + "." + "Fonts.MaterialIcons-Regular.codepoints");
        using (var sr = new System.IO.StreamReader(stream, System.Text.Encoding.UTF8))
        {
          string content = sr.ReadToEnd();
          var lines = content.Split('\n');
          foreach (var line in lines)
          {
            var parts = line.Split(' ');
            if (parts.Length == 2)
            {
              if (!IconNameToValueDict.ContainsKey(parts[0]))
              {
                var c = (char)int.Parse(parts[1], System.Globalization.NumberStyles.HexNumber);
                IconNameToValueDict.Add(parts[0], c.ToString());
              }
            }
          }
        }
      }

      if (IconNameToValueDict.TryGetValue(name, out var value))
        return value;
      return "\ue87e";// System.Text.Encoding.UTF8.GetString(bytes);

    }

Icons in WPF

Image of Icons in WPF.png
This page was edited 26 days ago on 10/22/2024. What links here